<%@ Page
    Language="C#"
    MasterPageFile="~/DefaultMaster.master"
    AutoEventWireup="true"
    CodeFile="TimerExtender.aspx.cs"
    Inherits="TimerExtender_TimerExtender"
    Title="TimerExtender Sample"    
    Theme="SampleSiteTheme"%>

<asp:Content ContentPlaceHolderID="SampleContent" Runat="Server">
    
    <ajaxToolkit:ToolkitScriptManager runat="server" ID="ScriptManager1" />

    
    <div class="demoarea">
        <div class="demoheading">TimerExtender Demonstration</div>
    
        <asp:Timer ID="Timer1" runat="server" Interval="10000" ontick="Timer1_Tick">
        </asp:Timer>
        <br />
        Server Timer: <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label><br />
        Msg:<asp:Label ID="Label2" runat="server" Text="-" style="color:Red"></asp:Label><br /><br />
        
        <myajaxToolkit:TimerExtender runat="server" ID="timerReset" TargetControlID="Timer1" 
            ResetOnMouseAction="true"
            ResetOnKeyPress="true"
            OnClientTick="clienttick">
        </myajaxToolkit:TimerExtender>        
        
        Reset Timer on Mouse Action: <input id="mouse" type="checkbox" onclick="toogleMouse();" value="false" checked /><br />
        Reset Timer on KeyPress: <input id="key" type="checkbox" onclick="toogleKey();" value="false" checked /><br />

        <script type="text/javascript">
        function toogleMouse()
        {
            var tmr = $find('<%=timerReset.ClientID %>');
            tmr.set_resetOnMouseAction(!tmr.get_resetOnMouseAction());
        }
        function toogleKey()
        {
            var tmr = $find('<%=timerReset.ClientID %>');
            tmr.set_resetOnKeyPress(!tmr.get_resetOnKeyPress());
        }                
        function clienttick(sender, args)
        {
            var msg = $get('<%=Label2.ClientID %>');
            var post = confirm('Continue with postback?');
            if(!post)
                msg.innerHTML = 'Postback cancelled!';
            args.set_cancel(!post);
        }
        </script>    
                
    </div>
    <div class="demobottom"></div>
    
    <asp:Panel ID="description_HeaderPanel" runat="server" style="cursor: pointer;">
        <div class="heading">
            <asp:ImageButton ID="Description_ToggleImage" runat="server" ImageUrl="~/images/collapse.jpg" AlternateText="collapse"  />
            TimerExtender Description
        </div>
    </asp:Panel>
    <asp:Panel id="description_ContentPanel" runat="server" style="overflow:hidden;">
        <p>
            The TimerExtender is a web control that allow you to control a timer control.
        </p>
    </asp:Panel>

    <asp:Panel ID="properties_HeaderPanel" runat="server" style="cursor: pointer;">
        <div class="heading">
            <asp:ImageButton ID="Properties_ToggleImage" runat="server" ImageUrl="~/images/expand.jpg" AlternateText="expand"  />
            TimerExtender Properties
        </div>
    </asp:Panel>
    <asp:Panel id="properties_ContentPanel" runat="server" style="overflow:hidden;" Height="0px">
        <p>The control above is initialized with this code. The <em>italic</em> properties are optional:</p>
<pre>&lt;myajaxToolkit:TimerExtender
    runat="Server"
    <em>ResetOnMouseAction</em>="true"
    <em>ResetOnKeyPress</em>="true"
    <em>OnClientTick</em>="clienttick"
&lt;/myajaxToolkit:TimerExtender&gt;</pre>
        <ul>
            <li><strong>ResetOnMouseAction</strong> - Determines if timer have to be reset when a mouse action is raised (move, down, up)</li>
            <li><strong>ResetOnKeyPress</strong> - Determines if timer have to be reset when a key is pressed</li>
            <li><strong>OnClientTick</strong> - Function raise on client when timer expires</li>
        </ul>        
    </asp:Panel>
  
    <ajaxToolkit:CollapsiblePanelExtender ID="cpeDescription" runat="Server" 
        TargetControlID="description_ContentPanel"
        ExpandControlID="description_HeaderPanel"
        CollapseControlID="description_HeaderPanel"
        Collapsed="False" 
        ImageControlID="description_ToggleImage" />
    <ajaxToolkit:CollapsiblePanelExtender ID="cpeProperties" runat="Server" 
        TargetControlID="properties_ContentPanel"
        ExpandControlID="properties_HeaderPanel"
        CollapseControlID="properties_HeaderPanel"
        Collapsed="True" 
        ImageControlID="properties_ToggleImage" />
 
</asp:Content>